import { Route, Switch, Redirect } from 'react-router-dom'
import { Suspense } from 'react'
import {routerType}  from "../types/index.d"
 

interface routers{
    RouterList:routerType[];
}
let RouterView=(props:routers)=>{
      let routerlist=props.RouterList&&props.RouterList.filter(item=>!item.to)
      let redirect=props.RouterList&&props.RouterList.filter(item=>item.to)[0]

      return (
          <Suspense fallback={<div>...loading</div>}>
               <Switch>
                   {
                       routerlist&&routerlist.map((item,index)=>{
                           return <Route key={index} path={item.path} render={(routerprops)=>{
                                  return <item.component {...routerprops} child={item.children}></item.component>
                           }}></Route>
                       })
                   }

                   {
                       redirect&&<Redirect from={redirect.path} to={redirect.to as string}></Redirect>
                   }
               </Switch>
          </Suspense>
      )
}

export default RouterView;
